<div [matTooltip]="canManage() ? '' : manageRestrictedExplanation()">
  <button
    mat-icon-button
    type="button"
    [ixTest]="['actions-for', device().description]"
    [matMenuTriggerFor]="menu"
    [disabled]="!canManage()"
    [class.disabled]="!canManage()"
    [attr.tabindex]="!canManage() ? -1 : 0"
    [attr.aria-label]="'Actions for {device}' | translate: { device: device().description }"
  >
    <ix-icon name="more_vert"></ix-icon>
  </button>
</div>

<mat-menu #menu="matMenu">
  @if (showEdit()) {
    <button
      mat-menu-item
      type="button"
      [ixTest]="['edit', device().description]"
      (click)="edit.emit()"
    >{{ 'Edit' | translate }}</button>
  }

  <button
    mat-menu-item
    type="button"
    [ixTest]="['delete', device().description]"
    (click)="deletePressed()"
  >{{ 'Delete' | translate }}</button>
</mat-menu>
